﻿<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="basePath" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>新增组织</title>
	<jsp:include page="/resources/inc/formHead.jsp" />
</head>
<body>
	<form id="createForm" class="layui-form layui-form-pane" method="post">
		<div class="layui-form-item">
			<label class="layui-form-label">选择上级组织</label>
			<div class="layui-input-block">
				<input class="layui-input" id="parentSel" type="text" readonly value=""  onclick="showMenu();" />
				<input type="hidden" id="parentId" name="pid" />
			</div>
			<div id="menuContent" class="menuContent" style="display:none; position: absolute;z-index: 999">
				<ul id="treeContainer" class="ztree" style="margin-top:0; width:180px; height: 200px;"></ul>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label" for="name">名称</label>
			<div class="layui-input-block">
				<input id="name" type="text" class="layui-input" name="name" maxlength="20">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label" for="sort">排序</label>
			<div class="layui-input-block">
				<input id="sort" type="text" class="layui-input" name="sort" maxlength="10">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label" for="description">描述</label>
			<div class="layui-input-block">
				<input id="description" type="text" class="layui-input" name="description" maxlength="300">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
			<a class="layui-btn" href="javascript:;" onclick="createSubmit();">保存</a>
			<a class="layui-btn layui-btn-primary" href="javascript:;" onclick="closeDialog();">取消</a>
			</div>
		</div>
	</form>
	<jsp:include page="/resources/inc/formFooter.jsp" />
<script>
	function createSubmit() {
		$.ajax({
			type: 'post',
			url: '${basePath}/manage/organization/create',
			data: $('#createForm').serialize(),
			beforeSend: function() {
				if ($('#name').val() == '') {
					$('#name').focus();
					return false;
				}
			},
			success: function(result) {
				if (result.code != 1) {
					if (result.data instanceof Array) {
						$.each(result.data, function(index, value) {
							parent.layer.msg(value.errorMsg);
						});
					} else {
						parent.layer.msg(result.data.errorMsg);
					}
				} else {
					closeDialog();
				}
			},
			error: function(XMLHttpRequest, textStatus, errorThrown) {
				parent.layer.msg(textStatus);
			}
		});
	}

	function closeDialog() {
		var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
		parent.layer.close(index); //再执行关闭
		parent.$table.bootstrapTable('refresh');
	}


	var setting = {
		check: {
			enable: true,
			chkStyle: "radio",
			radioType: "all"
		},
		view: {
			dblClickExpand: false,
			selectedMulti: false
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			onClick: onClick,
			onCheck: onCheck
		}
	};

	//初始化node节点
	var zNodes =[
		<c:forEach var="org" items="${list}" varStatus="status">
			<c:choose>
				<c:when test="${status.end}">
					{id:${org.organizationId}, pId:${org.pid}, name:"${org.name}",open:true}
				</c:when>
				<c:otherwise>
					{id:${org.organizationId}, pId:${org.pid}, name:"${org.name}",open:true},
				</c:otherwise>
			</c:choose>
		</c:forEach>
	];

	function onClick(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeContainer");
		zTree.checkNode(treeNode, !treeNode.checked, null, true);
		return false;
	}

	function onCheck(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeContainer"),
				nodes = zTree.getCheckedNodes(true),
				v = "", id = "";
		for (var i=0, l=nodes.length; i<l; i++) {
			v += nodes[i].name + ",";
			id += nodes[i].id + ",";
		}
		if (v.length > 0 ) v = v.substring(0, v.length-1);
		if (id.length > 0 ) id = id.substring(0, id.length-1);
		$("#parentSel").attr("value", v);
		$("#parentId").attr("value", id);
		hideMenu();
	}


	/*function onClick(e, treeId, treeNode) {
		$("#parentSel").attr("value", treeNode.name);
		$("#parentId").attr("value", treeNode.id);

	}*/

	function showMenu() {
		var parentObj = $("#parentSel");
		var parentOffset = $("#parentSel").offset();
		$("#menuContent").css({left:parentOffset.left + "px", top:parentOffset.top + parentObj.outerHeight() + "px"}).slideDown("fast");

		$("body").bind("mousedown", onBodyDown);
	}
	function hideMenu() {
		$("#menuContent").fadeOut("fast");
		$("body").unbind("mousedown", onBodyDown);
	}
	function onBodyDown(event) {
		if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
			hideMenu();
		}
	}

	$(document).ready(function(){
		$.fn.zTree.init($("#treeContainer"), setting, zNodes);
	});
</script>
</body>
</html>